<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
<link rel="stylesheet" type="text/css"
href="../EXT4/resources/css/ext-all.css" />
<link rel="stylesheet" type="text/css"
href="../css/style.css" />
<script type="text/javascript" src="../EXT4/ext-all.js"></script>
<script type="text/javascript" src="../script/ext-lang-zh_CN.js"></script>

<script type="text/javascript">
Ext.onReady(function() {
	Ext.QuickTips.init();
	var itemsPerPage = 20;
	Ext.define('SlowVO', { 
	    extend: 'Ext.data.Model', 
	    // fields定义字段和数据类型 
	    fields: ['id', 'studentName', 'subjectName','slowtime','slowlesson','addtime','addlesson','chargeback'] 
	});
	
	var slowstore = Ext.create('Ext.data.Store', {
	    model: 'SlowVO', 
	    autoLoad: true,
	    pageSize: itemsPerPage,
	    //使用ajax代理 
	    proxy: { 
	        type: 'ajax', 
	        url: '../service/slow_all',
	        //Reader 解码json数据 
	        reader: { 
	            type: 'json', 
	            root: 'root', 
	            total: 'total'
	        }
	    }
	});
	
	var slowpanel=Ext.create('Ext.Panel', {
	    id:'slow-panel',
	    baseCls:'x-plain',
	    renderTo:'slowmng',
	    items:[{
	        xtype:'fieldset',
	        title: '查询条件',
	        collapsible: true,
	        defaultType: 'textfield',
	        layout: 'hbox',
	        items :[{
	            fieldLabel: '姓名:',
	            labelWidth:30,
	            width:200,
	            id: 'searchname',
	            margin:'0 10 0 0',
	        },{
	            fieldLabel: '课程:',
	            labelWidth:30,
	            width:200,
	            id: 'searchsubject',
	            margin:'0 10 0 0'
	        }]
	    },Ext.create('Ext.grid.Panel', {
	    	store: slowstore,
	        columns: [ 
	        { 
	            text: '学生姓名', width: 100, dataIndex: 'studentName', editor: 'textfield'
	        },{ 
	            text: '课程名称', width: 120, dataIndex: 'subjectName', editor: 'textfield' 
	        },{ 
	            text: '缓修时段', width: 200, dataIndex: 'slowtime', editor: 'textfield' 
	        },{ 
	        	text: '缓修课时', width: 120, dataIndex: 'slowlesson', editor: 'textfield' 
	        },{
	        	text: '补修时段', width: 200, dataIndex: 'addtime', editor: 'textfield' 
	        },{
	        	text: '补修课时', width: 120, dataIndex: 'addlesson', editor: 'textfield' 
	        },{
	        	text: '是否占位', width: 120, dataIndex: 'chargeback', editor: 'textfield' 
	        },{ 
	        	text: '操作',
	            xtype: 'actioncolumn',
	            width: 40,
	            items: [{
	                icon   : '../EXT4/fam/cog_edit.png"',  // Use a URL in the icon config
	                tooltip: '修改',
	                handler: function(grid, rowIndex, colIndex) {
	                	var rec = grid.getStore().getAt(rowIndex);
	                	Ext.create('Ext.Window', {
	            			id:'updateslowwin',
	            	    	width:340,
	            	    	height:330,
	            	    	resizable :false,
	            	    	draggable : false,
	            	    	modal:true,
	            	    	title:'缓修信息',
	            	    	loader: {
	            	        	url: 'updateslow',
	            	        	loadMask: 'loading...',
	            	        	autoLoad: true,
	            	        	scripts: true,
	            	        	params: {
	            	        		id: rec.get('id')
	            	        	}
	            	        },
	               	        listeners:{
	               	        	'close':function(){
	               	        		slowstore.reload();
	               	        	}
	               	        }
	            	    }).show();
	                }
	            }]
	        }],
	        tbar : [{  
	            xtype : 'button',  
	            text : '查询',
	            handler: function() {
	            	var studentname = Ext.getCmp('searchname').getValue();
	            	var subjectname = Ext.getCmp('searchsubject').getValue();
	            	studentname = escape(studentname);
	            	subjectname = escape(subjectname);
					slowstore.loadPage(1,{ params:{'studentname':studentname,'subjectname':subjectname} });
	            }
	        },{  
	            xtype : 'button',  
	            text : '新增',
	            handler: function() {
	            	Ext.create('Ext.Window', {
            			id:'addslowwin',
            	    	width:340,
            	    	height:330,
            	    	resizable :false,
            	    	draggable : false,
            	    	modal:true,
            	    	title:'缓修信息',
            	    	loader: {
            	        	url: 'addslow',
            	        	loadMask: 'loading...',
            	        	autoLoad: true,
            	        	scripts: true
            	        },
               	        listeners:{
               	        	'close':function(){
               	        		slowstore.reload();
               	        	}
               	        }
            	    }).show();
	            }
	        }],
	        //分页 
	        dockedItems: [{ 
	            xtype: 'pagingtoolbar', 
	            store: slowstore,
	            dock: 'bottom', 
	            displayInfo: true 
	            }]
	    })]
	});
	
	window.onresize = function(){
		setTimeout(function(){slowpanel.setWidth(Ext.getDom("slowmng").width);},100);
	};
});	
</script>
</head>
<body>
	<div id="slowmng"></div>
</body>
</html>